<template>
    <div class="new-directory file-info">
        <pui-dialog :title="props.title" v-model="componentRef.dialogVisible" :animate="props.animate" isFooter>
            <template #content>
                <div class="form">
                    <div class="form-item">
                        <div class="label">文件夹名称</div>
                        <pui-input placeholder="请输入文件夹名称" v-model="componentRef.directoryName" type="input" clearAble full></pui-input>
                    </div>
                </div>
            </template>
            <template #footer>
                <pui-button @click="submitHandle">创建</pui-button>
            </template>
        </pui-dialog>
    </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
    name: 'NewDirectory'
})
</script>
<script lang="ts" setup>
import { reactive, getCurrentInstance } from 'vue'
import { projectService as project } from '@/services/phot_client/client'
const { proxy } = getCurrentInstance() as any
const props = defineProps({
    title: {
        type: String,
        default: '新建文件夹'
    },
    animate: {
        type: String,
        default: 'fade'
    }
})
const emit = defineEmits({
    onSuccess: (val: any) => {}
})
const componentRef = reactive({
    dialogVisible: false,
    directoryName: '',
    path: ''
})
const init = (path: any) => {
    componentRef.path = path
    componentRef.dialogVisible = true
}
const closeDialog = () => {
    componentRef.dialogVisible = false
}
const submitHandle = async () => {
    console.log(componentRef.path + '/' + componentRef.directoryName)
    await project.newDirectory(componentRef.path + '/' + componentRef.directoryName).then((res: any) => {
        console.log(res)
        if (res) {

        }
        emit('onSuccess', res)
        closeDialog()
    }).catch((err: any) => {
        console.log(err)
    })
}
defineExpose({
    init
})
</script>
<style lang="scss">
@import './fileStyle.scss';
</style>